<template>
<div>
	<div class="question--list__left--wrap">
		<section class="question--list__left--title">
            <div class="question--list__left--title--left">
    		    <div class="question--list__left--title__frist">
                          <div class="question--list__left--title__frist--img">
                           </div>
                           <div class="question--list__left--title__frist--content" @click="">
                                 文件夹
                           </div>
                </div>
                <div class="question--list__left--title__second">
                         <div class="question--list__left--title__second--img">
                        </div>
                        <div class="question--list__left--title__second--content">
                                 子文件夹
                        </div>
                </div>
            </div>
            <div class="question--list__left--title__thrid">
                     
            </div>
		</section>
     </div>
     <v-leftall></v-leftall>
</div>
</template>
<script>
import leftall from './leftall/leftall.vue';
export default {
    data(){
            return{
               message:"我的题库"
            }
    },
    components: {
       'v-leftall' : leftall,
    },
};
</script>
<style lang="scss" scoped>
@import 'src/common/styles/mixins';

    .router-slid-enter-active, .router-slid-leave-active {
        transition: all .4s;
    }
    .router-slid-enter, .router-slid-leave-active {
        transform: translate3d(2rem, 0, 0);
        opacity: 0;
    }
   .question--list__left--wrap{
         width: 100%;
         background-color:#f1f3f7;
        .question--list__left--title{
            width: 279px;
            margin: 0 auto;
            height: 50px;
            line-height: 50px;
            font-size: 20px;
            color:#999;
            @extend %flexbox;
            @include alignItem(center,center);
            @include justifyContent( space-between ,justify);
            .question--list__left--title--left{
                @include flex(1);
                 @extend %flexbox;
                  .question--list__left--title__frist{
                        @extend %flexbox;
                         @include alignItem(center,center);
                        @include justifyContent( space-between ,justify);
                        .question--list__left--title__frist--img{
                             width:25px;
                            height: 25px;
                            background-color:#ff651a;

                        }
                        .question--list__left--title__frist--content{
                            margin-left: 11px;
                        }
                        
                  }
                  .question--list__left--title__second{
                    margin-left:25px;
                         @include flex(1);
                          @extend %flexbox;
                        @include alignItem(center,center);
                         .question--list__left--title__second--img{
                                  width:25px;
                            height: 25px;
                            background-color:#ff651a;
                         }
                         .question--list__left--title__second--content{
                                margin-left: 11px;
                         }

                  }
            }
            .question--list__left--title__thrid{
                width:25px;
                height: 25px;
                background-color:#ff651a;
            }
        }
   }
</style>
